.mod-cluster.cluster-detail
    .mod-option
        a.ui-btn.ui-btn-lg.ui-btn-link.ui-btn-bright(ui-sref="addHost({id:clusterId})")
            i.icon-add-white
            | 添加主机
        a.icon-delete(ng-click="deleteCluster()")
    .cluster-info
        tabset
            tab(heading="主机列表" active="tabActive[0].active" ui-sref="clusterDetail.hostlist")
                loading(ng-if="isWaitingHost")
                .info-options
                    span 已选中{{nodeListIns.selectedCount}}个
                    button.ui-btn.ui-btn-bright.ui-btn-sm(ng-click="addLabels()")
                        | 添加主机标签
                    .info-right
                        span.info-count(ng-cloak) 共{{nodelistFiltered.length}}台主机
                        input.ui-input-fill.ui-input-white.ui-input-search(placeholder="输入主机名查找" ng-model="hostKey")
                table.ui-table-dome.full
                    thead
                        tr
                            th
                                dome-check(d-id="allNode" ng-model="nodeListIns.isCheckAll" d-change="nodeListIns.checkAllItem(model)")
                                | 主机名称
                            th IP
                            th CPU总量（个）
                            th 内存总量（MB）
                            th 运行实例（个）
                            th 状态
                            th(ng-if="config.buildConfig===1") 是否用于构建
                    tbody
                        tr(ng-if="nodelistFiltered.length===0")
                            td(colspan="6") 无相关信息
                        tr(ng-repeat="node in nodelistFiltered=(nodeListIns.nodeList|filter:{'name':hostKey})")
                            td
                                dome-check(d-id="node{{$index}}" ng-model="node.isSelected" d-change="nodeListIns.toggleCheck(node,model)")
                                a.ui-table-link(ng-bind="node.name" ui-sref="hostDetail({name:node.name,clusterId:clusterId})")
                            td(ng-bind="node.ip")
                            td(ng-bind="node.capacity.cpu")
                            td(ng-bind="node.capacity.memory")
                            td(ng-bind="node.runningPods")
                            td(ng-switch="node.status")
                                span(ng-switch-when="Ready").txt-safe 在线
                                span(ng-switch-default).txt-prompt 离线
                            td(ng-if="config.buildConfig===1")
                                dome-toggle(ng-class="{'on':node.isUsedByBuild}" ng-click="toggleNodeLabel(node)")
            tab(heading="集群设置" active="tabActive[1].active" ui-sref="clusterDetail.info")
                button.ui-btn.ui-btn-sm.ui-btn-white.edit-cluster(ng-click="checkEdit()" ng-if="!isEdit") 编辑
                button.ui-btn.ui-btn-sm.ui-btn-primary.edit-cluster(ng-click="checkEdit()" ng-if="isEdit") 取消编辑
                div(ng-form name="modifyclusterFrom")
                    div.tab-cluster(ng-include="'index/tpl/tplClusterInfo/tplClusterInfo.html'" ng-if="!isEdit")
                    div.tab-cluster(ng-include="'index/tpl/tplClusterInfo/tplClusterInfoEdit.html'" ng-if="isEdit")
                .com-bottom-option(ng-if="isEdit")
                    .com-bottom-option-con
                        button.ui-btn.ui-btn-bright.ui-btn-md(ng-disabled="isWaitingModify" ng-click="valid.needValid=true;modifyclusterFrom.$valid&&modifyCluster()") 保存设置
                        span.txt-error(ng-if="valid.needValid&&(modifyclusterFrom.$invalid||!clusterIns.etcdValid||!clusterIns.zookeeperValid||!clusterIns.kafkaValid)") 存在不合法数据，请修改后提交。
            tab(heading="namespace" ng-click="getNamespace()" active="tabActive[2].active" ui-sref="clusterDetail.namespace")
                loading(ng-if="isWaitingNamespace")
                .info-options(ng-form role="form" name="namespaceForm" ng-class="{'need-valid':needValidNamespace}")
                    span.namespace-title namespace
                    .namespace-con
                        p.txt-prompt.namespace-description 通过namespace对集群内的部署进行逻辑划分，同一集群的同一namespace下，不会出现同名部署。
                        .new-namespace
                            input.ui-input-white.namespace-txt(ng-model="namespaceTxt.namespace" name="namespace" ng-pattern="/^[a-zA-Z][a-zA-Z0-9_-]*$/")
                            button.ui-btn.ui-btn-sm.ui-btn-primary(ng-disabled="isLoadingNamespace" ng-click="needValidNamespace=true;namespaceForm.$valid&&addNamespace()") 添加namespace
                        span.txt-error(ng-if="(valid.needValid||namespaceForm.namespace.$dirty)&&namespaceForm.namespace.$invalid")
                        ul.com-label-list.namespace-list
                            li(ng-repeat="namespace in namespaceList")
                                span.label-item
                                    | {{namespace}}
            tab(heading="集群成员" ng-hide="!hasMemberPermisson" active="tabActive[3].active" ui-sref="clusterDetail.users")
                div.tab-member(ng-include="'index/tpl/tplUserList/tplUserList.html'")
script(type="text/ng-template" id="addLabelModal.html")
    .d-modal-header 添加主机标签
    .modal-body.modal-addlabel
        span.label-name 主机标签
        .labels-wrap
            input.ui-input.ui-input-white.label-txt(ng-model="newLabel")
            button.ui-btn.ui-btn-sm.ui-btn-primary(ng-click="addLabel()" ng-disabled="!newLabel") 添加标签
            p.txt-prompt 会对勾选的主机加上相同的主机标签
            .labels-con
                span.ui-label(ng-repeat="label in labelList" ng-cloak)
                    | {{label}}
                    a.icon-cancel(ng-click="deleteLabel($index)")
        .modal-footer
            button.ui-btn.ui-btn-primary.ui-btn-sm.pull-right(ng-click="submitLabels()") 确定
            button.ui-btn.ui-btn-white.ui-btn-sm.pull-right(ng-click="cancel()") 取消